/**
 * 技师管理的增加、编辑
 * @author: minzhang
 * @update: 2016-10-13
 */

import React, {PropTypes} from 'react';
import {Link} from 'dva/router';
import {Modal, Table, Button} from 'antd';
				
const TechManageSetProj = ({
		selectedRowKeys,
		projList,
		projLoading,
    projModalVisible,
    projBtnLoading,
		onSelectChange,
		onProjOk,
		onProjCancel,
}) => {
	
	const columns = [{
	  title: '项目编号',
	  dataIndex: 'num',
	  key: 'num',
		width: 100,
	}, {
	  title: '项目',
	  dataIndex: 'name',
	  key: 'name',
  },{
	  title: '时长',
	  dataIndex: 'time',
	  key: 'time',
		width: 100,
		render(text, record) {
			return <div>{text}分钟</div>
		},
	},{
	  title: '价格',
	  dataIndex: 'price',
	  key: 'price',
		width: 100,
		render(text, record) {
			return <div>{text.toFixed(2)}</div>
		},
	},{
	  title: '分类',
	  dataIndex: 'type',
	  key: 'type',
		width: 100,
	}];
	
	// rowSelection object indicates the need for row selection
	const rowSelection = {
		selectedRowKeys,
		onChange: onSelectChange,
	};
	
	const modalOpts = {
    title: '设置可做项目',
    visible: projModalVisible,
		width: 800,
		maskClosable: false,
		okText: '设为可做项目',
		confirmLoading: projBtnLoading,
		onOk: () => onProjOk(selectedRowKeys.join(',')),
		onCancel: onProjCancel,
  };

	return (
		<Modal {...modalOpts}>
			<Table 
			 columns={columns} 
			 rowSelection={rowSelection}
			 rowKey={record => record.id}
			 dataSource={projList} 
			 loading={projLoading} 
			 pagination={false}
			 scroll={{ y: 360 }}
			 bordered 
			/>
		</Modal>
	);
};

TechManageSetProj.propTypes = {
    visible: PropTypes.any,
    projBtnLoading: PropTypes.any,
    onOk: PropTypes.func,
};

export default TechManageSetProj;